<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>点击我跳转到a.html</button>
    <button>点击我前进到下一个历史记录</button>
    <button>点击我跳转到b.html历史记录</button>
    <script>
        // 一.通过js来操作浏览器的历史记录 ，前提是必须有历史记录；
        var btnEle = document.getElementsByTagName("button");
        btnEle[0].onclick = function(){
            window.location.href = "./a.html";
        }

        // window.history.forward： 前进到下一个历史记录 
        btnEle[1].onclick = function(){
            window.history.forward();
        }

        // 总结： 1.必须有历史记录 2.前进历史记录 forward  3.后退历史记录 back 。无论是前进还是回退都只操作一个页面
        // 4.window.history.go(数字);

        // 二、跳转到指定历史记录；
        // window.history.go(数字) ： 0是当前页面 正数是前进的历史记录  负数是回退的历史记录
        btnEle[2].onclick = function(){
            window.history.go(2);
        }

    </script>
    
</body>
</html>